<template>
  <div>
    <!-- 搜索条件盒子 -->
    <div>
      <p class="pinformation">搜索条件</p>
      <el-form label-width="85px" ref="queryRef" :model="queryParams">
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同编号：" prop="contractCode">
              <el-input maxlength="100" clearable placeholder="请输入合同编号" v-model="queryParams.contractCode"
                @keyup.enter="handleQuery" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合同类型：" prop="contractType">
              <el-select v-model="queryParams.contractType" placeholder="请选择合同类型" @change="handleQuery" clearable>
                <el-option v-for="dict in proxy.addListNoLimit(sys_contract_type)" :key="dict.value" :label="dict.label"
                  :value="dict.value" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同名称：" prop="contractName">
              <el-input maxlength="100" clearable placeholder="请输入合同名称" v-model="queryParams.contractName"
                @keyup.enter="handleQuery" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="紧急类型：" prop="degree">
              <el-select v-model="queryParams.degree" @change="handleQuery" placeholder="请选择紧急类型" clearable>
                <el-option v-for="dict in proxy.addListNoLimit(sys_degree)" :key="dict.value" :label="dict.label"
                  :value="parseInt(dict.value)" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="委托单位：" prop="wtCustomName">
              <el-input maxlength="100" clearable placeholder="请输入委托单位" v-model="queryParams.wtCustomName"
                @keyup.enter="handleQuery" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-row justify="end">
              <el-button type="success" @click="handleQuery">搜索</el-button>
              <el-button class="business resetBtn" @click="resetQuery">重置</el-button>
            </el-row>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <!-- 检测类别列表盒子 -->
    <div>
      <el-row style="justify-content: space-between">
        <el-row>
          <p class="pinformation">合同列表</p>
          <p class="totalStyle">共 {{ total }} 条数据</p>
        </el-row>
        <el-row style="padding-bottom: 5px">
          <el-button link icon="Plus" @click="clickAdd" v-show="status == 0 && !props.queryContractId">新增</el-button>
        </el-row>
      </el-row>
      <el-table ref="mainTableRef" v-loading="loading" :data="checkTable" :row-class-name="tableRowClass"
        @row-click="rowClick">
        <el-table-column label="合同编号" align="center" prop="contractCode" width="130" />
        <el-table-column label="委托单位" align="center" prop="wtCustomName" show-overflow-tooltip />
        <el-table-column label="操作" align="center" width="100">
          <template #default="scope">
            <el-button link @click="handleCopy(scope.row)">复制</el-button>
            <el-button link @click="deleteBtnClick(scope.row)" v-if="status == 0">删除</el-button>
            <el-button link @click="handleRevoke(scope.row)"
              v-if="isShow == 3 && status == 1 && scope.row.isRevoke == 0">撤回</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize" @pagination="getList" />
    </div>
  </div>
</template>

<script setup>
import { listContract, delContract, revoke,copyContract } from "@/api/contract/check";

const { proxy } = getCurrentInstance();
const {  sys_degree } = proxy.useDict(
  "sys_degree"
);
const {
  sys_contract_type,
} = proxy.useOrgDict(
  "sys_contract_type",
);
const total = ref(0);
const checkTable = ref([]);
const loading = ref(false);
const isRevoke = ref(false)
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    contractType: -1,
    degree: -1,
    status: props.status,
    contractId: props.queryContractId
  },
});
const status = ref(props.status);
const { queryParams, form } = toRefs(data);
const props = defineProps({
  queryContractId: {
    type: String
  },
  contractId: {
    type: String,
  },
  status: {
    type: Number
  },
  isShow: {
    type: Number
  }
});

watch(
  () => total.value,
  () => {
    if (total.value) {
      heightParams.value = [{ tableName: "main", bottomHeight: 74 }];
    } else {
      heightParams.value = [{ tableName: "main", bottomHeight: 21 }];
    }
    getTableHeight();
  }
);
watch(
  () => props.isShow,
  (newVal) => {
    isShow.value = newVal;
  }
);
const isShow = ref(props.isShow);
const heightParams = ref([{ tableName: "main", bottomHeight: 21 }]);
function getTableHeight() {
  proxy.adaptiveHeight(proxy, heightParams.value);
}

onMounted(() => {
  nextTick(function () {
    if (props.queryContractId) {
    emits("echo", props.queryContractId);
    emits("getStatus", props.status)
    heightBright.value = props.queryContractId;
  }
    getTableHeight();
    window.addEventListener("resize", getTableHeight);
  });
 
})

onUpdated(() => {
  nextTick(function () {
    getTableHeight();
  });
});

const emits = defineEmits(["clickAdd"]["echo"], ["getStatus"], ["revokeGotoFirst"]);

function getList() {
  listContract(queryParams.value).then((res) => {
    checkTable.value = res.rows;
    total.value = res.total;
  });
}

function deleteBtnClick(row) {
  proxy.$modal
    .confirm("是否确认删除选中的数据项？")
    .then(function () {
      return delContract(row.contractId);
    })
    .then(() => {
      clickAdd();
      proxy.$modal.msgSuccess("删除成功");
      getList();
    })
    .catch(() => { });
}

function handleRevoke(row) {
  revoke(row.contractId).then(res => {
    if (res.code != 200) {
      proxy.$modal.msgError(res.msg);
      return;
    }
    proxy.$modal.msgSuccess("撤回成功");
    emits("getStatus", 0)
    // emits("revokeGotoFirst");
  })
}

function handleCopy(row){
  if(!row.contractId){
    proxy.$modal.msgError("请先保存当前合同！");
    return;
  }
  copyContract(row.contractId).then(res => {
    proxy.$modal.msgSuccess("复制成功");
    rowClick({contractId: res.data,copy:true,status:0})
  });
}
onBeforeUnmount(() => {
  window.removeEventListener("resize", getTableHeight);
});

function clickAdd() {
  queryParams.value = {
    pageNum: 1,
    pageSize: 10,
    contractType: -1,
    degree: -1,
    status: props.status
  };
  emits("echo", "");
  emits("clickAdd", "clickAdd");
  emits("getStatus", 0)
  heightBright.value = "";
}

function rowClick(row) {
  emits("echo", row.contractId,row.copy);
  if(row.copy){
    emits("getStatus", row.status)
  }else{
    emits("getStatus", props.status)
  }
  heightBright.value = row.contractId;
  // getContract(row.contractId).then((res) => {
  // });
}

function handleQuery() {
  queryParams.pageNum = 1;
  nextTick(() => {
    heightBright.value = props.contractId;
  });
  getList();
}
function resetQuery() {
  proxy.resetForm("queryRef");
  getList();
}

defineExpose({
  handleQuery,
});

const heightBright = ref("");
function tableRowClass({ row }) {
  if (row) {
    if (row.contractId == heightBright.value) {
      return "current-row";
    }
    return "";
  }
}

getList();
</script>
